<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- <input type="text" id="year" value="123123" > -->
    <input type="text" id="year"  >
    <button id="btn">判断</button>
    <input type="text" id="result">
</body>
<script>
    // 输入判断
    // 需求: 在yearInp输入框中输入一个年份  点击判断  => 将结果输出到 resultInp结果框

    // 注意:
    // 1. JS操作元素之前 需要先获取元素 
    // 2. 表单元素取值  xxx.value
    // 3. 能改变元素的只有元素本身  
    // 4. 没有等号  或者 等号在value左边  => 取值  console.log(yearInp.value); var year = yearInp.value;
    //    等号在value右边  => 赋值    resultInp.value = "xxx!";

    // (1)  获取元素
    var yearInp = document.getElementById("year");
    var btn = document.getElementById("btn");
    var resultInp = document.getElementById("result");
    console.log(yearInp,btn,resultInp);

    // (2)  点击按钮时  取值 => 判断
    // 2.1  绑定点击事件
    btn.onclick = function(){
        // alert(1111);

        // debugger;

        // 2.2   如何取值?  
        // console.log(yearInp.value);  //取值   => 字符串类型
        // yearInp.value = "嘿嘿";   //赋值    把yearInp的value值 改为 嘿嘿
        
        // console.log(yearInp.value);  //取值
        var year = yearInp.value; // 将resultInp输入框的值取出 赋值给变量 year 
        //                             year存储的是用户输入的值  不能代表元素
        // year = 123123;              // 重新给year赋值
        
        // 2.3  用户是否输入内容
        if(year){   // 有内容  
            // 2.4  年份范围 1000-9999的整数
            if(year >= 1000 && year <= 9999 && year % 1 == 0){
                console.log("year ok");
                // 2.5  判断平闰年
                if( year % 4 == 0  && year % 100 != 0){
                    resultInp.value = year + "是普通闰年";
                }else if( year % 400 == 0 ) {
                    resultInp.value = year + "是世纪闰年";
                }else{
                    resultInp.value = year + "是平年";
                }
            }else{  
                // alert("请输入1000-9999的年份");
                resultInp.value = "请输入1000-9999的年份";
            }
        }else{ // "" 
            // alert("请输入年份!");
            resultInp.value = "请输入年份!";
        }

    }


</script>
</html>